<template>
  <div class="container">
    <div class="topBox">
      <!--      <el-button-->
      <!--        type="primary"-->
      <!--        size="medium"-->
      <!--        icon="el-icon-circle-plus-outline"-->
      <!--        @click="diagShow(1,'新增')"-->
      <!--      >录入论证编制-->
      <!--      </el-button>-->
      录入论证编制
    </div>
    <div class="contain">
      <el-table :data="arguList" style="width: 100%">
        <el-table-column prop="id" label="id" width></el-table-column>
        <el-table-column prop="nickname" label="姓名" width></el-table-column>
        <el-table-column prop="service" label="公共服务" width></el-table-column>
        <el-table-column prop="research" label="研究成果" width></el-table-column>
        <!--        <el-table-column prop="project" label="项目名称" width></el-table-column>-->
        <el-table-column label="指南编制" width="">
          <template slot-scope="scope">
            <el-button @click="viewUserInfo(2,'guide',scope.row)" type="text" size="small">查看</el-button>
            <el-button type="text" @click="editUserInfo(3,'编辑用户信息',scope.row)" size="small">编辑</el-button>
          </template>
        </el-table-column>
        <el-table-column label="标准编制" width="">
          <template slot-scope="scope">
            <el-button @click="viewUserInfo(2,'standard',scope.row)" type="text" size="small">查看</el-button>
            <el-button type="text" @click="editUserInfo(3,'编辑用户信息',scope.row)" size="small">编辑</el-button>
          </template>
        </el-table-column>
        <el-table-column label="项目申报" width="">
          <template slot-scope="scope">
            <el-button @click="viewUserInfo(2,'application',scope.row)" type="text" size="small">查看</el-button>
            <el-button type="text" @click="editUserInfo(3,'编辑用户信息',scope.row)" size="small">编辑</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-dialog :visible.sync="viewGuide">
        <el-form ref="form" :model="argumentInfo" label-width="80px">
          <el-form-item label="项目" v-for="(item,index) in argumentInfo" :key="index">
            <el-input v-model="item.project_id" placeholder></el-input>
            <el-form-item v-for="(item1,index1) in item.guide" :key="index1">
              角色排名指数:
              <el-input v-model="item1.level" placeholder></el-input>
              参与人数:
              <el-input v-model="item1.total_people" placeholder></el-input>
            </el-form-item>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="addInputFn('guide')">保 存</el-button>
        </div>
      </el-dialog>
      <el-dialog :visible.sync="viewStandard">
        <el-form ref="form" :model="argumentInfo" label-width="80px">
          <el-form-item label="项目" v-for="(item,index) in argumentInfo" :key="index">
            <el-input v-model="item.project_id" placeholder></el-input>
            <el-form-item v-for="(item1,index1) in item.standard" :key="index1">
              角色排名指数:
              <el-input v-model="item1.level" placeholder></el-input>
              参与人数:
              <el-input v-model="item1.total_people" placeholder></el-input>
            </el-form-item>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="addInputFn('standard')">保 存</el-button>
        </div>
      </el-dialog>
      <el-dialog :visible.sync="viewApplication">
        <el-form ref="form" :model="argumentInfo" label-width="80px">
          <el-form-item label="项目" v-for="(item,index) in argumentInfo" :key="index">
            <el-input v-model="item.project_id" placeholder></el-input>
            <el-form-item v-for="(item1,index1) in item.application" :key="index1">
              角色排名指数:
              <el-input v-model="item1.level" placeholder></el-input>
              参与人数:
              <el-input v-model="item1.total_people" placeholder></el-input>
              绩点系数:
              <el-input v-model="item1.ratio" placeholder></el-input>
              项目金额:
              <el-input v-model="item1.money" placeholder></el-input>
            </el-form-item>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="addInputFn('application')">保 存</el-button>
        </div>
      </el-dialog>
      <el-dialog title="奖项录入" :visible.sync="editDialog">
        <el-form :model="argumentInfo">
          <!--          <el-form-item label="角色排名指数" :label-width="formLabelWidth">-->
          <!--            <el-input v-model="argumentInfo.rank" autocomplete="off"></el-input>-->
          <!--          </el-form-item>-->
          <!--          <el-form-item label="级别系数" :label-width="formLabelWidth">-->
          <!--            <el-input v-model="argumentInfo.level" autocomplete="off"></el-input>-->
          <!--          </el-form-item>-->
          <!--          <el-form-item label="参与人数" :label-width="formLabelWidth">-->
          <!--            <el-input v-model="argumentInfo.total_people" autocomplete="off"></el-input>-->
          <!--          </el-form-item>-->
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="addInputFn('award')">保 存</el-button>
        </div>
      </el-dialog>
      <el-dialog title="录入论证编制" :visible.sync="dialogFormVisible">
        <el-form :model="diagForm">
          <el-form-item label="姓名" :label-width="formLabelWidth">
            <el-select v-model="diagForm.user_id" filterable placeholder="请选择">
              <el-option
                v-for="item in userList"
                :key="item.nickname"
                :label="item.nickname"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="项目" :label-width="formLabelWidth">
            <el-select v-model="diagForm.user_id" filterable placeholder="请选择">
              <el-option
                v-for="item in userList"
                :key="item.nickname"
                :label="item.nickname"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-form-item>
          <div>指南编制</div>
          <el-form-item label="级别系数" :label-width="formLabelWidth">
            <el-input v-model="diagForm.guide[0].level" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="参数人数" :label-width="formLabelWidth">
            <el-input v-model="diagForm.guide[0].total_people" autocomplete="off"></el-input>
          </el-form-item>
          <div>标准标志</div>
          <el-form-item label="级别系数" :label-width="formLabelWidth">
            <el-input v-model="diagForm.standard[0].level" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="参数人数" :label-width="formLabelWidth">
            <el-input v-model="diagForm.standard[0].total_people" autocomplete="off"></el-input>
          </el-form-item>
          <div>项目申报</div>
          <el-form-item label="绩点系数" :label-width="formLabelWidth">
            <el-input v-model="diagForm.application[0].level" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="项目金额" :label-width="formLabelWidth">
            <el-input v-model="diagForm.application[0].money" autocomplete="off"></el-input>
          </el-form-item>

          <el-form-item label="排名系数" :label-width="formLabelWidth">
            <el-input v-model="diagForm.application[0].ratio" autocomplete="off"></el-input>
          </el-form-item>

          <el-form-item label="申报人数" :label-width="formLabelWidth">
            <el-input v-model="diagForm.application[0].total_people" autocomplete="off"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogFormVisible = false">取 消</el-button>
          <el-button type="primary" @click="addArgument()">确 定</el-button>
        </div>
      </el-dialog>
    </div>
  </div>
</template>
<script>
  import {addArgument} from "@/api/api";
  import {getArgumentList, getArgumentListDetail, getUserList} from "../../api/api";

  export default {
    name: "",
    data() {
      return {
        tableData: [],
        dialogFormVisible: false,
        viewGuide: false,
        viewStandard: false,
        viewApplication: false,
        editGuide: false,
        editStandard: false,
        editApplication: false,
        guideInfo: {},
        standardInfo: false,
        applicationInfo: false,
        argumentInfo: [],
        form: {},
        formLabelWidth: "120px",
        userList: [],
        user_id: null,
        arguList: [],
        diagForm: {
          user_id: null,
          project_id: null,
          guide: [
            {
              level: 0,
              total_people: 0
            }
          ],
          standard: [
            {
              level: 0,
              total_people: 0
            }
          ],
          application: [
            {
              level: 0,
              total_people: 0,
              money: 0,
              ratio: 0
            }
          ]
        }
      };
    },
    created() {
      this.getUserListFn()
      this.getArgumentListFn()
    },
    methods: {
      diagShow() {
        this.dialogFormVisible = true;
      },
      addArgument() {
        this.dialogFormVisible = false;
        console.log(this.diagForm);
        var data = addArgument(this.diagForm);
        if (data.data.code === 200) {
          this.$message({
            type: "success",
            message: "删除成功"
          });
          this.getPrjListFn();
        } else {
          this.$message.error("添加失败");
        }
      },
      async getArgumentListFn() {
        let data = await getArgumentList(this.params)
        console.log(data)
        this.arguList = data.data.data
        console.log(this.arguList)
      },
      async getUserListFn() {
        let data = await getUserList(this.params)
        console.log(data)
        this.userList = data.data.data.list
        console.log(this.userList)
      },
      async viewUserInfo(type, title, row) {
        let data = await getArgumentListDetail({
          user_id: row.id
        })
        this.user_id = row.id
        console.log(data)
        switch (title) {
          case 'guide': {
            this.viewGuide = true
            this.argumentInfo = data.data.data
            console.log(this.argumentInfo)
            for (let i = 0; i < this.argumentInfo.length; i++) {
              console.log('===')
              let tmp = this.argumentInfo[i].guide
              if (tmp.length === 0) {
                this.argumentInfo[i].guide = [{
                  "level": null,
                  "total_people": null
                }]
              } else {
                this.argumentInfo[i].guide = JSON.parse(tmp)
              }
              console.log(this.argumentInfo[i].guide)
            }
            console.log(this.argumentInfo)
            break
          }
          case 'standard': {
            this.viewStandard = true
            this.argumentInfo = data.data.data
            console.log(this.argumentInfo)
            for (let i = 0; i < this.argumentInfo.length; i++) {
              console.log('===')
              let tmp = this.argumentInfo[i].standard
              if (tmp.length === 0) {
                this.argumentInfo[i].standard = [{
                  "level": null,
                  "total_people": null
                }]
              } else {
                this.argumentInfo[i].standard = JSON.parse(tmp)
              }
              console.log(this.argumentInfo[i].standard)
            }
            console.log(this.argumentInfo)
            break
          }
          case 'application': {
            this.viewApplication = true
            this.argumentInfo = data.data.data
            console.log(this.argumentInfo)
            for (let i = 0; i < this.argumentInfo.length; i++) {
              console.log('===')
              let tmp = this.argumentInfo[i].application
              if (tmp.length === 0) {
                this.argumentInfo[i].application = [{
                  "level": null,
                  "total_people": null
                }]
              } else {
                this.argumentInfo[i].application = JSON.parse(tmp)
              }
              console.log(this.argumentInfo[i].application)
            }
            console.log(this.argumentInfo)
            break
          }
          default:
            break;
        }
      },
      async editUserInfo(type, title, row) {
        this.editDialog = true
        let data = await getArgumentListDetail({
          user_id: row.id
        })
        console.log(data)
      },
      async addInputFn(topic) {
        console.log(this.argumentInfo)
        console.log(this.user_id)
        let data = await addArgument({
          topic: topic,
          argument: this.argumentInfo,
          user_id: this.user_id
        })
        console.log(data);
        if (data.data.code === 200) {
          this.$message({
            type: "success",
            message: "录入成功"
          });
          if (topic === 'guide') {
            this.viewGuide = false
          }
          if (topic === 'standard') {
            this.viewStandard = false
          }
          if (topic === 'application') {
            this.viewApplication = false
          }
        } else {
          this.$message.error("添加失败");
        }
      }
    }
  };
</script>
<style lang="scss" scoped>
  .topBox {
    padding: 10px 0;
    width: calc(100% - 10px);
    margin: auto;
    border-bottom: solid 1px #e6e6e6;

    .topInput {
      width: 200px;
    }
  }
</style>
